<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script src="vue.js"></script>
</head>
<body>
  <div id="app" v-my-directive></div>
  <script>
    // 定义一个MyPlugin（自定义插件）对象
    let MyPlugin = {}
    // 编写插件对象的install方法
    MyPlugin.install = function (Vue, options) {
      console.log(options)
      // 在插件中为Vue添加自定义指令
      Vue.directive('my-directive', {
        bind (el, binding) {
          // 为自定义指令v-my-directive绑定的DOM元素设置style样式
          el.style = 'width:100px;height:100px;background-color:#ccc;'
        }
      })
    }
    Vue.use(MyPlugin, { someOption: true })
    var vm = new Vue({
      el: '#app'
    })
    var Vue = require('Vue')
    var vueRouter = require('vue-router')
    Vue.use(vueRouter)
 </script>
</body>
</html>